const btn = document.querySelector('button');
const listLi = document.querySelectorAll('li');
const home = document.querySelector('.home');

// 
const otherxhr = new XMLHttpRequest();
otherxhr.responseType = 'json';
otherxhr.open('GET','http://124.220.159.29:8089/info/getInfo')
otherxhr.send();
otherxhr.onreadystatechange = function(){
    if(otherxhr.readyState === 4) {
        if(otherxhr.status >= 200 && otherxhr.status < 300) {
            home.innerHTML = otherxhr.response[0].allIntroduction;
        }
    }
}
// 

// 
btn.addEventListener('click',function(){
    const xhr = new XMLHttpRequest();
    xhr.responseType = 'json';
    xhr.open('GET','http://124.220.159.29:8089/user/getAll');
    xhr.send();
    xhr.onreadystatechange = function(){
        if(xhr.readyState === 4) {
            if(xhr.status >= 200 && xhr.status < 300) {
                listLi[6].innerHTML = xhr.response[0].id;
                listLi[7].innerHTML = xhr.response[0].name;
                listLi[8].innerHTML = xhr.response[0].password;
                listLi[9].innerHTML = xhr.response[0].gender;
                listLi[10].innerHTML = xhr.response[0].introduction;
                listLi[11].innerHTML = xhr.response[0].goodAt;

                listLi[12].innerHTML = xhr.response[1].id;
                listLi[13].innerHTML = xhr.response[1].name;
                listLi[14].innerHTML = xhr.response[1].password;
                listLi[15].innerHTML = xhr.response[1].gender;
                listLi[16].innerHTML = xhr.response[1].introduction;
                listLi[17].innerHTML = xhr.response[1].goodAt;

                listLi[18].innerHTML = xhr.response[2].id;
                listLi[19].innerHTML = xhr.response[2].name;
                listLi[20].innerHTML = xhr.response[2].password;
                listLi[21].innerHTML = xhr.response[2].gender;
                listLi[22].innerHTML = xhr.response[2].introduction;
                listLi[23].innerHTML = xhr.response[2].goodAt;

                listLi[24].innerHTML = xhr.response[3].id;
                listLi[25].innerHTML = xhr.response[3].name;
                listLi[26].innerHTML = xhr.response[3].password;
                listLi[27].innerHTML = xhr.response[3].gender;
                listLi[28].innerHTML = xhr.response[3].introduction;
                listLi[29].innerHTML = xhr.response[3].goodAt;

                listLi[30].innerHTML = xhr.response[4].id;
                listLi[31].innerHTML = xhr.response[4].name;
                listLi[32].innerHTML = xhr.response[4].password;
                listLi[33].innerHTML = xhr.response[4].gender;
                listLi[34].innerHTML = xhr.response[4].introduction;
                listLi[35].innerHTML = xhr.response[4].goodAt;

                listLi[36].innerHTML = xhr.response[5].id;
                listLi[37].innerHTML = xhr.response[5].name;
                listLi[38].innerHTML = xhr.response[5].password;
                listLi[39].innerHTML = xhr.response[5].gender;
                listLi[40].innerHTML = xhr.response[5].introduction;
                listLi[41].innerHTML = xhr.response[5].goodAt;

                listLi[42].innerHTML = xhr.response[6].id;
                listLi[43].innerHTML = xhr.response[6].name;
                listLi[44].innerHTML = xhr.response[6].password;
                listLi[45].innerHTML = xhr.response[6].gender;
                listLi[46].innerHTML = xhr.response[6].introduction;
                listLi[47].innerHTML = xhr.response[6].goodAt;

                listLi[48].innerHTML = xhr.response[7].id;
                listLi[49].innerHTML = xhr.response[7].name;
                listLi[50].innerHTML = xhr.response[7].password;
                listLi[51].innerHTML = xhr.response[7].gender;
                listLi[52].innerHTML = xhr.response[7].introduction;
                listLi[53].innerHTML = xhr.response[7].goodAt;

                listLi[54].innerHTML = xhr.response[8].id;
                listLi[55].innerHTML = xhr.response[8].name;
                listLi[56].innerHTML = xhr.response[8].password;
                listLi[57].innerHTML = xhr.response[8].gender;
                listLi[58].innerHTML = xhr.response[8].introduction;
                listLi[59].innerHTML = xhr.response[8].goodAt;

                listLi[60].innerHTML = xhr.response[9].id;
                listLi[61].innerHTML = xhr.response[9].name;
                listLi[62].innerHTML = xhr.response[9].password;
                listLi[63].innerHTML = xhr.response[9].gender;
                listLi[64].innerHTML = xhr.response[9].introduction;
                listLi[65].innerHTML = xhr.response[9].goodAt;
            }
        }
    }
})
// 